@headerBg: #313131;
@active: #409eff;
@headHeight: 3.85rem;
@white: #ffffff;

.banner-header {
  .header {
    width: 100%;
    height: @headHeight;
    background: @headerBg;

    .header-inner-row {
      height: inherit;

      .el-col {
        height: inherit;

        .el-menu.el-menu--horizontal {
          border-bottom: none;
        }

        .el-menu-item {
          i {
            font-size: 1.5rem;
            color: @white;
          }

          .is-fixed {
            top: 1.45em;
          }
        }

        .el-menu-item:hover {
          background: transparent !important;
        }

        .el-menu-item.is-active {
          background: transparent !important;
          border-bottom: 2px solid transparent;

          i {
            color: @active;
          }
        }
      }

      .logo {
        width: 20.85rem;
        height: inherit;
        display: flex;

        .logo-img {
          width: 2.5rem;
          height: 2.85rem;
          border: none;
          margin: 0.5rem 0;
        }

        .logo-title {
          width: 17rem;
          padding-left: 1rem;
          height: inherit;
          color: @white;
          font-size: 1.525rem;
          line-height: @headHeight;
        }
      }
    }
  }

  .carousel .item {
    background-color: #333;
    height: 425px;
  }

  .carousel .item {
    background: -webkit-linear-gradient(
        rgba(23, 22, 23, 0.2),
        rgba(23, 22, 23, 0.5)
      ),
      url(./../../assets/images//ban22.jpg) no-repeat top center fixed;
    background: -moz-linear-gradient(
        rgba(23, 22, 23, 0.2),
        rgba(23, 22, 23, 0.5)
      ),
      url(./../../assets/images//ban22.jpg) no-repeat top center fixed;
    background: -ms-linear-gradient(
        rgba(23, 22, 23, 0.2),
        rgba(23, 22, 23, 0.5)
      ),
      url(./../../assets/images//ban22.jpg) no-repeat top center fixed;
    background: linear-gradient(rgba(23, 22, 23, 0.2), rgba(23, 22, 23, 0.5)),
      url(./../../assets/images//ban22.jpg) no-repeat top center fixed;
    background-size: cover;
  }

  .carousel-inner > .item > img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
  }
}
